/**
 * 
 */

$(function() {
	$("#languageId").change(function(){
		var language = $(this).children("option:selected").attr("data-key");
		if(language == 'zh' ){
			$(".zh-category").addClass("defaultForm");
			$(".en-category").removeClass("defaultForm");
		}else{
			$(".zh-category").removeClass("defaultForm");		
			$(".en-category").addClass("defaultForm");
		}
	})
	
	editable(".content-box-content .tab-content .editable");
	function editable(element, isclick){
		$(element).editable({
			editBy:"click"
		});
		if(isclick)
			$(element).click();
	}
	var zhDefaultText = "請輸入產品類別";
	var enDefaultText = "Enter Product Category";
	$(".zh-category .column-left .add").click(function(){
		$h5 = $("<h5>").addClass("editable").text(zhDefaultText);
		$("<li>").append("<input type=\"checkbox\" name=\"productCategoryId\" value=\"\"/>").append($h5)
	     .append("<div class=\"clear\"></div>").appendTo(".zh-category .column-left .subCategory");
		editable($h5, true);
	})
	$(".zh-category .column-right .add").click(function(){
		$h5 = $("<h5>").addClass("editable").text(zhDefaultText);
		$("<li>").append("<input type=\"checkbox\" name=\"productCategoryId\" value=\"\"/>").append($h5)	    
		.append("<div class=\"clear\"></div>").appendTo(".zh-category .column-right .subCategory");
		editable($h5, true);
	})
	$(".en-category .column-left .add").click(function(){
		$h5 = $("<h5>").addClass("editable").text(enDefaultText);
		$("<li>").append("<input type=\"checkbox\" name=\"productCategoryId\" value=\"\"/>").append($h5)
	     .append("<div class=\"clear\"></div>").appendTo(".en-category .column-left .subCategory");
		editable($h5, true);
	})
	$(".en-category .column-right .add").click(function(){
		$h5 = $("<h5>").addClass("editable").text(enDefaultText);
		$("<li>").append("<input type=\"checkbox\" name=\"productCategoryId\" value=\"\"/>").append($h5)	    
	     .append("<div class=\"clear\"></div>").appendTo(".en-category .column-right .subCategory");
		editable($h5, true);
	})
	
	$(".submit").click(function(){
		var categorys = [];
		$("fieldset").each(function(j){
			var languageId="";
			if($(this).parent().hasClass("zh-category")){
				languageId = $("option[data-key='zh']").val();
			}else if($(this).parent().hasClass("en-category")){
				languageId = $("option[data-key='en']").val();
			}
			
			var categoryType = "";
			if($(this).hasClass("column-left")){
				categoryType = 0;
			}else if($(this).hasClass("column-right")){
				categoryType = 1;
			}
			
			var category = {};
			category["categoryName"] = $(this).find("h4").text();
			category["productCategoryId"] =$(this).find(".check-all").val();
			category["categoryType"] = categoryType;
			category["languageId"] = languageId;
			var subCategorys = [];
			$(this).find(".subCategory li").each(function(i){
				var subCategory = {};
				subCategory["categoryName"] = $(this).children("h5").text();
				subCategory["productCategoryId"] = $(this).children(":checkbox").val();
				subCategory["categoryType"] = categoryType;
				subCategory["languageId"] = languageId;
				subCategorys[i] = subCategory;
			})
			category["subCategorys"] = subCategorys;
			categorys[j] = category;
		})
		$.ajax({
			url : ctx+"/category/save.do",
			data : {category : $.toJSON(categorys)},
			type : "POST",
			success: function(data){
				showInfo(data, function(){
					getCategory();					
				})
			}
		})
	})
	getCategory();
	function getCategory(){
		var languageMap = {};
		$("#languageId option").each(function(){
			languageMap["languageId_"+$(this).val()] = $(this).attr("data-key");
		})
		var typeMap = {type_0: "left", type_1:"right"};
		$.getJSON(ctx+"/category/getAll.do", function(data){
			if(data){
				$("ul.subCategory").empty();
				$.each(data, function(i, category){
					var key = eval("languageMap.languageId_"+category.languageId);
					var categoryDiv = $("."+key+"-category");
					var type = eval("typeMap.type_"+category.categoryType);
					var categoryFieldset = categoryDiv.find(".column-"+type); 
					categoryFieldset.find("h4").text(category.categoryName);
					categoryFieldset.find(".check-all").val(category.productCategoryId);
					$.each(category.subCategorys, function(j, subCategory){							
						$h5 = $("<h5>").addClass("editable").text(subCategory.categoryName);
						$("<li>").append("<input type=\"checkbox\" name=\"productCategoryId\" value='"+subCategory.productCategoryId+"'/>").append($h5)
					     .append("<div class=\"clear\"></div>").appendTo(categoryFieldset.find(".subCategory"));
						editable($h5);
					})
				})
			}
		})
	}
	
	$(".delete").click(function(){
		var deleteBtn = $(this);
		showMessage({
			message : "Are you sure delete!"
		},{
			OK:function(){
				var checkedCategory = $(deleteBtn).parents("fieldset").find(".subCategory").find(":checked");
				if(checkedCategory.val()){
					$.ajax({
						url : ctx+"/category/delete.do",
						data : {categoryId : checkedCategory.val()},
						type : "POST",
						success: function(data){
							showInfo(data, function(){					
							})
						},
						error: function(r){
							showInfo(r, function(){});
						}
					})
				}
				checkedCategory.parent("li").remove();				
			},
			Cancel:function(){}
		})
	})
})